<template>
	<rh-wx class="wallet-account-container">
		<view class="page-label flex-between">
			<text class="labe-txt">账户管理</text>
			<text class="labe-btn" @click="jumpPage('walletActivation')">账户变更</text>
		</view>
		<view class="form-content">
			<view class="form-item">
				<rh-input disabled label="账户姓名" v-model="baseData.accountName" placeholder="请输入账户持有人姓名"></rh-input>
			</view>
			<view class="form-item">
				<rh-input disabled label="银行账号" v-model="baseData.bankCard" placeholder="请输入银行账号"></rh-input>
			</view>
			<view class="form-item flex-between">
				<text class="item-label">开户行</text>
				<view class="item-val-content flex-normal">
					<image class="bank-logo" :src="`data:image/jpg;base64,${baseData.bankLogo}`"></image>
					<text class="val-txt">{{baseData.bankName}}</text>
				</view>
			</view>
		</view>
	</rh-wx>
</template>

<script>
	import {isWechat} from '@/script/wx-premission.js'
	import {getUserBankInfo} from '@/api/wallet/index.js'
	export default {
		data() {
			return {
				isWechat: isWechat(),
				baseData: {}
			}
		},
		onShow() {
			let _self = this
			if(!_self.isWechat) return
			_self.showWxApp().then(boo => {
				_self.queryUserBankInfo()
			})
		},
		methods: {
			jumpPage(name){
				let _self = this
				_self.$$router.push({name})
			},
			queryUserBankInfo(){
				let _self = this, isSuccess = false
				getUserBankInfo().then(res => {
					_self.baseData = res.data
				})
			},
		}

	}
</script>
<style lang="scss" scoped>
  // @include fontStyle(#666, 24rpx);
	@mixin fontStyle($color, $size, $weight: 500) {
		color: $color;
		font-size: $size;
		font-weight: $weight;
	}
	.wallet-account-container {
		background-color: #F4F8F9;
		min-height: 100vh;
		padding: 60rpx 20rpx;
		position: relative;
		.page-label{
			.labe-txt{
				@include fontStyle(#3D3D3D, 28rpx);
			}
			.labe-btn{
				@include fontStyle(#0003AA, 24rpx);
			}
		}
		.form-content{
			padding: 0 30rpx;
			background-color: #fff;
			border-radius: 6rpx;
			margin-top: 30rpx;
			.bank-logo{
				width: 34rpx;
				height: 34rpx;
				margin-right: 10rpx;
			}
			.val-txt{
				@include fontStyle(#3D3D3D, 28rpx);
			}
			.form-item{
				padding: 30rpx 0;
				border-bottom: 1rpx dashed #D8D8D8;
				.item-label{
					@include fontStyle(#666, 26rpx);
				}
				.item-val-content{
					@include fontStyle(#0A0A0A, 26rpx);
				}
			}
		}
	}
</style>


